import React, { Component } from 'react';
import { connect } from 'react-redux';
import { NavBar } from 'antd-mobile';
import { Route, Redirect } from 'react-router-dom';
import QueueAnim from 'rc-queue-anim';

import TabBar from '../tabBar';
import Boss from '../boss';
import Genius from '../genius';
import User from '../user';
import Msg from '../msg';

import { actionCreators } from '../../otherReducer/chat';

class Dashboard extends Component {
	componentDidMount() {
		const { chatList } = this.props;
		const newList = chatList.toJS();
        if(newList.length === 0) {
            this.props.getChatMsgList();
            this.props.recvMsg();
        }    
    }

    render() {
		
		const { pathname } = this.props.location;
		const { user } = this.props;
		const navList = [
			{
				path: '/boss',
				text: '求职',
				icon: 'boss',
				title: '求职列表',
				component: Boss,
				hide: user.type==='personage'
			},
			{
				path: '/genius',
				text: 'boss',
				icon: 'job',
				title: 'BOSS列表',
				component: Genius,
				hide: user.type==='boss'
			},
			{
				path: '/msg',
				text: '消息',
				icon: 'msg',
				title: '消息列表',
				component: Msg
			},
			{
				path: '/myself',
				text: '我',
				icon: 'user',
				title: '个人中心',
				component: User
			}
		]
		const currentPage = navList.find(v => v.path === pathname);
        if (!currentPage) {
			return <Redirect to="/myself" />
		}
        return (
			<div>
				<NavBar 
					className='fixd-header' 
					mode='dard'>
					{currentPage.title}
				</NavBar>
				<div style={{paddingTop: '45px'}}>		
					<QueueAnim type="left" duration={800}>
						<Route 
							key={currentPage.path} 
							path={currentPage.path} 
							component={currentPage.component}>
						</Route>
					</QueueAnim>																		
				</div>
				<TabBar data={navList}></TabBar>
			</div>
		)
    }

}
const mapStateToProps = (state) => ({
    user: state.getIn(['user', 'user']),
	chatList: state.getIn(['chat', 'chatList'])
});

const mapDispatchToProps = (dispatch) => ({
    getChatMsgList() {
        dispatch(actionCreators.getMsgList());
    },
    recvMsg() {
        dispatch(actionCreators.recvMsg());
    }
})

export default connect(mapStateToProps, mapDispatchToProps)(Dashboard);